$(function() {  
    FastClick.attach(document.body);  
});
var index = 0;
var width = document.documentElement.clientWidth;
(function($) {

	$.fn.touchSlider = function(settings) {

		settings.supportsCssTransitions = (function(style) {
			var prefixes = ['Webkit', 'Moz', 'Ms'];
			for(var i = 0, l = prefixes.length; i < l; i++) {
				if(typeof style[prefixes[i] + 'Transition'] !== 'undefined') {
					return true;
				}
			}
			return false;
		})(document.createElement('div').style);

		settings = jQuery.extend({
			roll: true,
			flexible: false,
			btn_prev: null,
			btn_next: null,
			paging: null,
			speed: 75,
			view: 1,
			range: 0.15,
			page: 1,
			transition: false,
			initComplete: null,
			counter: null,
			multi: false
		}, settings);

		var opts = [];
		opts = $.extend({}, $.fn.touchSlider.defaults, settings);

		return this.each(function() {

			$.fn.extend(this, touchSlider);

			var _this = this;

			this.opts = opts;
			this._view = this.opts.view;
			this._speed = this.opts.speed;
			this._tg = $(this);
			this._list = this._tg.children().children();
			this._width = parseInt(this._tg.css("width"));
			this._item_w = parseInt(this._list.css("width"));
			this._len = this._list.length;
			this._range = this.opts.range * this._width;
			this._pos = [];
			this._start = [];
			this._startX = 0;
			this._startY = 0;
			this._left = 0;
			this._top = 0;
			this._drag = false;
			this._scroll = false;
			this._btn_prev;
			this._btn_next;

			this.init();

			$(this)
				.bind("touchstart", this.touchstart)
				.bind("touchmove", this.touchmove)
				.bind("touchend", this.touchend)
				.bind("dragstart", this.touchstart)
				.bind("drag", this.touchmove)
				.bind("dragend", this.touchend)

			$(window).bind("orientationchange resize", function() {
				_this.resize(_this);
			});
		});

	};

	var touchSlider = {

		init: function() {
			var _this = this;

			$(this).children().css({
				"width": '20%',
				"overflow": "visible"

			});

			if(this.opts.flexible) this._item_w = this._width / this._view;
			if(this.opts.roll) this._len = Math.ceil(this._len / this._view) * this._view;

			var page_gap = (this.opts.page > 1 && this.opts.page <= this._len) ? (this.opts.page - 1) * this._item_w : 0;

			for(var i = 0; i < this._len; ++i) {
				this._pos[i] = 20 * i;
				this._start[i] = this._pos[i];
				this._list.eq(i).css({
					"float": "none",
					"display": "block",
					"position": "absolute",
					"top": "0",
					"left": this._pos[i] + "%",
					"width": '20%'
				});
				if(this.opts.supportsCssTransitions && this.opts.transition) {
					this._list.eq(i).css({
						"-moz-transition": "0ms",
						"-moz-transform": "",
						"-ms-transition": "0ms",
						"-ms-transform": "",
						"-webkit-transition": "0ms",
						"-webkit-transform": "",
						"transition": "0ms",
						"transform": ""
					});
				}
			}

//			if(this.opts.btn_prev && this.opts.btn_next) {
//				this.opts.btn_prev.bind("click", function() {
//					return false;
//				})
//				this.opts.btn_next.bind("click", function() {
//					return false;
//				});
//			}

//			if(this.opts.paging) {
//				$(this._list).each(function(i, el) {
//					var btn_page = _this.opts.paging.eq(i);
//
//					btn_page.bind("click", function(e) {
//						_this.go_page(i, e);
//						return false;
//					});
//				});
//			}

			this.initComplete();
		},

		initComplete: function() {
			if(typeof(this.opts.initComplete) == "function") {
				this.opts.initComplete(this);
			}
		},

		resize: function(e) {
			if(e.opts.flexible) {
				var tmp_w = e._item_w;

				e._width = parseInt(e._tg.css("width"));
				e._item_w = e._width / e._view;
				e._range = e.opts.range * e._width;

				for(var i = 0; i < e._len; ++i) {
					e._pos[i] = e._pos[i] / tmp_w * e._item_w;
					e._start[i] = e._start[i] / tmp_w * e._item_w;
					e._list.eq(i).css({
						"width": '20%'

					});
					if(this.opts.supportsCssTransitions && this.opts.transition) {
						e._list.eq(i).css({
							"-moz-transition": "0ms",
							"-moz-transform": "",
							"-ms-transition": "0ms",
							"-ms-transform": "",
							"-webkit-transition": "0ms",
							"-webkit-transform": "",
							"transition": "0ms",
							"transform": ""
						});
					}
				}
			}

		},

		touchstart: function(e) {
			index++;
			if((e.type == "touchstart" && e.originalEvent.touches.length <= 1) || e.type == "dragstart") {
				this._startX = e.pageX || e.originalEvent.touches[0].pageX;
				this._startY = e.pageY || e.originalEvent.touches[0].pageY;
				this._scroll = false;

				this._start = [];
				for(var i = 0; i < this._len; ++i) {
					if(index == 1) {
						this._start[i] = 20 * i;
					} else {
						this._start[i] = this._pos[i];
					}

				}
			}
		},

		touchmove: function(e) {
			if((e.type == "touchmove" && e.originalEvent.touches.length <= 1) || e.type == "drag") {
				this._left = (e.pageX || e.originalEvent.touches[0].pageX) - this._startX;
				this._top = (e.pageY || e.originalEvent.touches[0].pageY) - this._startY;
				var w = this._left < 0 ? this._left * -1 : this._left;
				var h = this._top < 0 ? this._top * -1 : this._top;

				if(w < 0 || this._scroll) {
					this._left = 0;
					this._drag = false;
					this._scroll = true;
				} else {
					e.preventDefault();
					this._drag = true;
					this._scroll = false;
					//					this.position(e);
				}
				var aa = 0;
				var aa1 = 0;
				var aa2 = 0;
				var bb = 0;
				var bb1 = 0;
				var bb2 = 0;
				for(var i = 0; i < this._len; ++i) {
					var tmp = this._start[i] + this._left / width * 100;
					if(this.opts.supportsCssTransitions && this.opts.transition) {
						var trans = "translate3d(" + tmp + "px,0,0)";
						this._list.eq(i).css({
							"left": "",
							"-moz-transition": "0ms",
							"-moz-transform": trans,
							"-ms-transition": "0ms",
							"-ms-transform": trans,
							"-webkit-transition": "0ms",
							"-webkit-transform": trans,
							"transition": "0ms",
							"transform": trans
						});
					} else {
						aa = this._list.eq(0).css("left");
						aa1 = aa.split('px');
						aa2 = aa1[0] / width * 100;
						bb = this._list.eq(this._len - 1).css("left");
						bb1 = bb.split('px');
						bb2 = bb1[0] / width * 100;
							if(aa2 <= 0&&bb2>80) {
								if(this._left >= 0) {
									if(aa2==0){
										var tem = 20*i;
										this._list.eq(i).css("left", tem + "%");
									}else{
										var ten = tmp + this._left / width * 100;
									    this._list.eq(i).css("left", ten + "%");
									}
									   
								} else {
									var tmp = this._start[i] + this._left / width * 100;
									this._list.eq(i).css("left", tmp + "%");
								}

							}else if(aa2>0){
								this._list.eq(0).css("left", '0');
							}else{
								this._list.eq(this._len - 1).css("left", '80%');
							}
							if(bb2 <= 80) {
								if(this._left >= 0) {
									var tem = tmp + this._left / width * 100;
									this._list.eq(i).css("left", tem + "%");
								} 
							}
							
//							
					}
					if(aa2 <= 0&&bb2>80 ) {
						if(this._left >= 0) {
							if(aa2==0){
								this._pos[i] = tem;
							}else{
								this._pos[i] = ten;
							}
								
						} else {
							this._pos[i] = tmp;
						}
					}
					if(bb2 <= 80) {
						if(this._left >= 0) {
							this._pos[i] = tem;
						} 
					}
					
				}
			}
		},

		touchend: function(e) {
			if((e.type == "touchend" && e.originalEvent.touches.length <= 1) || e.type == "dragend") {
				if(this._scroll) {
					this._drag = false;
					this._scroll = false;
					return false;
				}
				this._drag = false;
				this._scroll = false;
			}
		},
	};

})(jQuery);